<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
	*{padding:0; margin:0;}
	ul{list-style:none; width:1000px; height:690px; margin:0 auto; }
	li{width:200px; height:230px; float:left; position:relative;}
	span{display:block; width:200px; height:230px; opacity:.6; filter:alpha(opacity=60); position:absolute; background:#000}
	a{display:block; width:200px; height:230px;}
	a:hover span{opacity:.2; filter:alpha(opacity=20)}
</style>
</head>

<body>
<div>
	<ul>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    	<li><a href="#"><span></span><img src="img/0.jpg"/></a></li>
    </ul>
</div>
</body>
</html>
